/**
 * 404页面组件
 * 当用户访问不存在的页面路径时显示
 */
import React from 'react';
import { Button, Result } from 'antd';
import { useNavigate } from 'react-router-dom';

/**
 * 404 页面组件
 * 显示未找到页面的错误信息并提供返回主页的按钮
 * 
 * @returns 404页面未找到组件
 */
const NotFound: React.FC = () => {
  // 使用react-router的导航钩子，用于页面跳转
  const navigate = useNavigate();
  
  return (
    <Result
      status="404"                     // 状态码，使用404表示页面未找到
      title="404"                      // 标题
      subTitle="抱歉，您访问的页面不存在" // 副标题，友好的错误提示
      extra={
        <Button type="primary" onClick={() => navigate('/home')}>
          返回首页
        </Button>
      }
    />
  );
};

export default NotFound; 